<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
<!--    防止豆瓣防盗链屏蔽图片-->
    <meta name="referrer" content="never">
    <title>首页</title>
    <link rel="icon" href="titleLogo.PNG" sizes="32x32">
    <link rel="stylesheet" type="text/css" href="bootstrap.min.css">
    <script src="jquery.min.js"></script>
    <script src="bootstrap.min.js"></script>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_2072342_mdyap14ttk.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/common.css">
</head>
<body>
    <div class="top">
        <a href="https://movie.douban.com/top250" target="_blank">豆瓣TOP250主页</a>
    </div>
    <div class="container">
        <br><br>
        <div class="row">
            <form action="http://127.0.0.1:5000/search" method="get">
<!--                <div class="col-md-2" style=" padding: 0px">-->
<!--                    <img src="logo.PNG" style="height: 33px;width: 110px;margin: auto" class="img-responsive"></div>-->
<!--                <div class="col-md-10">-->
<!--                    <div  class="col-md-10" style=" padding: 0px"><input id="div1" name="kw" value="{{kw}}" placeholder="输入搜索内容......"/></div>-->
<!--                    <div  class="col-md-2" style=" padding: 0px"><button type="submit" class="btn btn-info" style="height: 36px;width: 112px;border-radius:0px 10px 10px 0px;">搜索</button></div>-->
<!--                </div>-->
                <div class="logo">
                    <img src="./img/logo.jpg" alt="" srcset="">
                    <i class="logoTitle">Jul-Search电影搜索</i>
                </div>
                <div class="searchBox">
                    <input class="search" type="text" placeholder="输入查询的电影或评分..." name="kw" value="{{kw}}">
                    <button type="submit">
                        <div class="searchButton">
                            <i class="iconfont icon-search"></i>
                        </div>
                    </button>
                </div>
            </form>
        </div>
        <br>
        {% for art in result %}
        <div class="row Content">
            <ul class="list-group">
                <li class="imgM">
                    <a href="{{art.link| safe}}" target="_blank">
                        <img src="{{art.img| safe}}">
                    </a>
                </li>
                <li class="my-list-group-item title"><a href="{{art.link| safe}}" target="_blank">{{art.title| safe}}</a></li>
                <li class="my-list-group-item">
                    <p class="pingfenPosition">
                        <i class="star"></i>
                        <i class="pingfen">{{art.score| safe}}</i>
                    </p>
                    <p>{{art.detailed| safe}}</p>
                    <p>{{art.actor| safe}}</p>
                    <p>{{art.pingjia| safe}}</p>
                </li>
                <li class="my-list-group-item">
                    <a href="{{art.link| safe}}" class="aboutLink" target="_blank">{{art.link| safe}}</a>&nbsp;<span class="aboutLink-span">豆瓣链接</span>
                </li>
            </ul>
        </div>
        {% endfor %}


<!--    返回顶部按钮    -->
    <div class="gotop">
        <i class="topIcon">↑</i>
    </div>

    <div class="row noContent" style="display:none">
        抱歉，Top250电影里没有找到您需要的电影哦~
    </div>

    </div>
    <div class="footer">
        &copy; Copy WJL 实训2
        <a href="javascipt:;" style="color:rgba(0,34,77,0.7)">关于Jul-Search搜索引擎</a>
    </div>
    <script src="./js/index.js">
    </script>
</body>
</html>